$(function () {
    $('#header').eq(0).click(function () {
        location.href = '../index.html'
    })
    let ownPage = document.querySelector('.subNav>a:nth-of-type(3)')
    let title = getQueryString('title')
    let categoryid = getQueryString('categoryid')
    let product = document.querySelector('#product>.product')
    let src
    let page = document.querySelector("#select>.page")
    let str = ''
    fetch('http://chst.vip:1234/api/getproductlist?categoryid=' + categoryid + '&title=' + title)
        .then(body => body.json())
        .then(res => {
            let productStr = ""
            res.result.forEach(item => {
                let regExp = /(\/|http)[^>]+\.(jpg|jpeg|png|gif)/g;
                src = item.productImg.match(regExp)
                src = src ? src[0] : item.productImg
                productStr += `<li productid=${item.productId}>
        <img src=${src} alt="">
        <div>
            <p>${item.productName}<br><span>${item.productPrice}</span></p>
            <div>
                <span>${item.productQuote}</span>
                <div>
                    <img src="../assets/images/讯息.png">
                    <span>${item.productCom}</span>
                </div>
            </div>
        </div>
    </li>`
            })
            let total = Math.ceil(res.totalCount / 10)
            for (var i = 0; i < total; i++) {
                str += `<option value=${i + 1}/${total} pageid=${i}>${i + 1}/${total}</option>`
            }
            product.innerHTML = productStr
            page.innerHTML = str
            let lis = document.querySelectorAll('#product>.product>li')
            // let uu =document.querySelector('#product>.product')
            for (var k = 0; k < lis.length; k++) {
                lis[k].onclick = function () {
                    let id = this.getAttribute('productid')
                    location.href = './bjsearchListDetail.html?productid=' + id + '&categoryid=' + categoryid + '&title=' + title
                }
            }

            let sel = document.querySelector('.page')
            let options = document.querySelectorAll("#select>.page>option")
            let val
            var values
            $('.btnLeft').click(function () {
                val = $("#select").find("select").find('option:selected').attr("pageid");
                val--
                // console.log(val)
                if (val <= 0) {
                    val = 0
                }
                values = val + 1 + '/' + total
                // console.log(values)
                $("#select").find("select").find("option[value = '" + values + "']").prop("selected", true).siblings().removeProp('selected')
                sendFetch(val - 0 + 1)

            })
            $('.btnRight').click(function () {
                val = $("#select").find("select").find('option:selected').attr("pageid");
                val++
                if (val >= total) {
                    val = total
                }
                values = val + 1 + '/' + total
                $("#select").find("select").find("option[value = '" + values + "']").prop("selected", true).siblings().removeProp('selected')
                sendFetch(val - 0 + 1)

            })
            sel.onchange = function () {
                // let pageid=options[this.options.selectedIndex].getAttribute('pageid')
                val = $("#select").find("select").find('option:selected').attr("pageid");
                values = (val - 0) + 1 + '/' + total
                $("#select").find("select").find("option[value = '" + values + "']").prop("selected", true).siblings().removeProp('selected')
                sendFetch(val - 0 + 1)

            }

        })
    ownPage.innerHTML = title
    ownPage.onclick = function () {
        location.reload()
    }
    var sendFetch = function (id) {
        fetch('http://chst.vip:1234/api/getproductlist?categoryid=' + categoryid + '&pageid=' + id)
            .then(body => body.json())
            .then(res => {
                let productStr = ""
                res.result.forEach(item => {
                    let regExp = /(\/|http)[^>]+\.(jpg|jpeg|png|gif)/g;
                    src = item.productImg.match(regExp)
                    src = src ? src[0] : item.productImg
                    productStr += `<li productid=${item.productId}>
            <img src=${src} alt="">
            <div>
                <p>${item.productName}<br><span>${item.productPrice}</span></p>
                <div>
                    <span>${item.productQuote}</span>
                    <div>
                        <img src="../assets/images/讯息.png">
                        <span>${item.productCom}</span>
                    </div>
                </div>
            </div>
        </li>`
                })
                product.innerHTML = productStr
            })
    }

})
